<template>
  <div class="dashboard page-wrap">
    <ol class="breadcrumb">
      <li><a href="javascript:;">首页</a></li>
      <li class="active">控制台</li>
    </ol>
    <div class="col-xs-12">
      <form class="form-inline">
        <div class="form-group">
          <label class="sr-only" for="exampleInputAmount">Amount (in dollars)</label>
          <div class="input-group">
            <div class="input-group-addon">搜索示范</div>
            <input type="text" class="form-control" id="exampleInputAmount" placeholder="Amount">
          </div>
        </div>
        <div class="form-group">
          <div class="input-group">
            <input type="text" class="form-control" id="exampleInputAmount" placeholder="Amount">
            <div class="input-group-addon">.00</div>
          </div>
        </div>
        <div class="form-group">
          <label>Name:</label>
          <input type="text" class="form-control" id="exampleInputName2" placeholder="Jane Doe">
        </div>
        <div class="form-group">
          <label>Name:</label>
          <select class="form-control">
                              <option>1</option>
                              <option>2</option>
                              <option>3</option>
                              <option>4</option>
                              <option>5</option>
                          </select>
        </div>
        <button type="submit" class="btn btn-primary">Search</button>
      </form>
    </div>
    <div class="col-xs-12">
      <div class="page-header">
        <h1>Example page header <small>Subtext for header</small></h1>
      </div>
      <div class="table-responsive">
        <table class="table table-condensed">
          <thead>
            <tr>
              <th>#</th>
              <th>First Name</th>
              <th>Last Name</th>
              <th>Username</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <th scope="row">1</th>
              <td>Mark</td>
              <td>Otto</td>
              <td>@mdo</td>
            </tr>
            <tr>
              <th scope="row">2</th>
              <td>Jacob</td>
              <td>Thornton</td>
              <td>@fat</td>
            </tr>
            <tr>
              <th scope="row">3</th>
              <td>Larry</td>
              <td>the Bird</td>
              <td>@twitter</td>
            </tr>
          </tbody>
        </table>
      </div>
      <div class="text-right">
        <nav aria-label="Page navigation">
          <ul class="pagination pagination-sm">
            <li><a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
            <li><a href="#">5</a></li>
            <li>
              <a href="#" aria-label="Next">
                <span aria-hidden="true">&raquo;</span>
              </a>
            </li>
          </ul>
        </nav>
        <div>
        <!--
  <el-button>默认按钮</el-button>
  <el-button type="primary">主要按钮</el-button>
  <el-button type="success">成功按钮</el-button>
  <el-button type="info">信息按钮</el-button>
  <el-button type="warning">警告按钮</el-button>
  <el-button type="danger">危险按钮</el-button>
  -->
</div>
      </div>
    </div>
  </div>
</template>

<script>
import Vue from 'vue'

/*element*/
// import ElementUI from 'element-ui'
// import 'element-ui/lib/theme-chalk/index.css'
// Vue.use(ElementUI, { size: 'small' })

  export default {
    data() {
      return {
        items: [{
            text: 'Home',
            href: '#'
          },
          {
            text: 'Library',
            href: '#'
          },
          {
            text: 'Data',
            href: '#'
          }
        ]
      }
    }
  }
</script>

<style lang="scss">
 
</style>